<template>
	<view id="sampleSearch">
		<view class="nav-box">
			<view class="nav-box-text">
				<image src="@/static/img/home/person.png" class="person"></image>
				<view class="welcome">
					<view><text>姓名：{{ userInfo.nickName }}</text></view>
					<view><text>单位：{{ userInfo.dept.deptName }}</text></view>
				</view>
			</view>
		</view>
		<view class="project">
			<text>{{ projectInfo.name }}</text>
			<button type="primary" size="mini" @click="popupToggle('open')"><uni-icons type="search" color="#fff" size="14" /></button>
		</view>
		<!-- 检测信息 -->
		<view class="uni-list-box" v-if="listData.length > 0">
			<view class="list-item" v-for="(item, index) in listData" :key="index">
				<view class="list-item-line title">
					<text class="item-text">检测项目：{{ item.sampling.typeName }}</text>
				</view>
				<view class="list-item-line">
					<text class="sub-text" style="flex-shrink: 0;">原材料名称</text>
					<text class="sub-text u-margin-left-40">{{ item.sampling.materialName }}</text>
				</view>
				<view class="list-item-line">
					<text class="sub-text">二维码</text>
					<text class="sub-text u-margin-left-40">{{ item.sampling.qrCode }}</text>
				</view>
				<view class="list-item-line">
					<text class="sub-text">送检时间</text>
					<text class="sub-text u-margin-left-40">{{ item.sampling.createTime }}</text>
				</view>
				<!-- <view class="list-item-line">
					<text class="sub-text">检测进度</text>
					<view class="sub-text u-margin-left-40">
						<uni-tag class="project-status" :text="item.stateName" type="warning" size="small" v-if="item.state == 0" />
						<uni-tag class="project-status" :text="item.stateName" type="warning" size="small" v-if="item.state == 2" />
						<uni-tag class="project-status" :text="item.stateName" type="warning" size="small" v-if="item.state == 3" />
						<uni-tag class="project-status" :text="item.stateName" type="primary" size="small" v-if="item.state == 4" />
						<uni-tag class="project-status" :text="item.stateName" type="royal" size="small" v-if="item.state == 6" />
						<uni-tag class="project-status" :text="item.stateName" type="royal" size="small" v-if="item.state == 8" />
						<uni-tag class="project-status" :text="item.stateName" type="success" size="small" v-if="item.state == 9" />
					</view>
				</view> -->
				<view style="display: flex;justify-content: flex-end;">
					<uni-tag text="修改" class="u-margin-top-15" type="primary" size="small" @click="toPath('/pages/sampleSearch/edit?qrCode='+item.sampling.qrCode)" v-if="(userInfo.dept.type == 'build'||userInfo.dept.type == 'construct') && (item.sampling.status == 2 || item.sampling.status == 0)" />
					<uni-tag text="信息查看" class="u-margin-top-15 u-margin-left-10" type="primary" size="small" @click="toPath('/pages/infoSearch/index?qrCode='+item.sampling.qrCode)" />
					<uni-tag text="委托单授权" class="u-margin-top-15 u-margin-left-10" type="primary" size="small" @click="authorize(item)" v-if="userInfo.dept.type == 'build' && item.sampling.status > 2" />
					<uni-tag text="委托单生成" class="u-margin-top-15 u-margin-left-10" type="primary" size="small" @click="openDialog(item)" v-if="(userInfo.dept.type == 'build'||userInfo.dept.type == 'construct') && item.sampling.status == 2" />
					
					<!-- <uni-tag text="委托单查看" class="u-margin-top-15 u-margin-left-10" type="primary" size="small" @click="toPath(item.order.orderFile.url)" v-if="item.sampling.status > 2" /> -->
				</view>
			</view>
		</view>
		<uni-load-more :status="status" :icon-size="16" :content-text="contentText" v-if="listData.length > 0" />
		<view style="text-align: center;margin: 20px;" v-if="listData.length == 0"><text>暂无数据</text></view>
		<!-- 搜索内容 -->
		<uni-popup ref="sampleSearchPopup" :maskClick="false" background-color="#fff">
			<scroll-view style="height: calc(100vh - 44px);" scroll-y="true">
				<view class="popup-search">
					<uni-section title="条件搜索" type="line" style="margin-top: 0;"></uni-section>
					<uni-forms :modelValue="searchForm" class="search-box" :label-width="85" border>
						<uni-forms-item label="唯一标识" name="qrCode"><uni-easyinput type="text" v-model="searchForm.qrCode" placeholder="请输入二维码编码" /></uni-forms-item>
						 <!-- <uni-forms-item label="二维码编码" name="name"><uni-easyinput type="text" v-model="searchForm.code" placeholder="请输入二维码编码" /></uni-forms-item>
						<uni-forms-item label="工程名称" name="name"><uni-easyinput type="text" v-model="searchForm.projectName" placeholder="请输入工程名称" /></uni-forms-item>
						<uni-forms-item label="检测项目" name="name"><uni-easyinput type="text" v-model="searchForm.checkItem" placeholder="请输入检测项目" /></uni-forms-item>
						<uni-forms-item label="取样员" name="name"><uni-easyinput type="text" v-model="searchForm.checker" placeholder="请输入取样员" /></uni-forms-item>
						<uni-forms-item label="取样时间" name="name"><uni-datetime-picker v-model="searchForm.sampleTime" :border="false" type="daterange" /></uni-forms-item>
						<uni-forms-item label="见证人" name="name"><uni-easyinput type="text" v-model="searchForm.jzr" placeholder="请输入见证人" /></uni-forms-item>
						<uni-forms-item label="检测进度" name="name">
							<picker @change="checkProgressChange" :value="checkProgressIndex" :range="checkProgressOptions" range-key="name">
								<view class="uni-input">{{ checkProgressOptions[checkProgressIndex].name }}</view>
							</picker>
						</uni-forms-item> -->
					</uni-forms>
					<button @click="search" type="primary" class="u-margin-20">查询</button>
					<button @click="popupToggle('close')" type="default" class="u-margin-20" style="background-color: #fff;">取消</button>
				</view>
			</scroll-view>
		</uni-popup>
		
		<!-- 委托单打印授权 -->
		<uni-popup ref="sampleAuthorizePopup" background-color="#fff" :mask-click="false" type="dialog">
			<uni-popup-dialog title="委托单打印授权" type="input" :duration="2000" @confirm="dialogConfirm">
				<uni-data-checkbox multiple v-model="authorizeUnit" :localdata="authorizeUnitOptions"></uni-data-checkbox>
			</uni-popup-dialog>
		</uni-popup>
		
		<!-- 委托单生成 -->
		<uni-popup ref="companyPopup" background-color="#fff">
			<view class="popup-content">
				<uni-forms :modelValue="dialog.queryForm" :label-width="80" border style="padding: 0 10px;">
					<uni-forms-item label="日期" name="date">
						<uni-datetime-picker type="date"  v-model="dialog.check.date" :start="startDate" />
					</uni-forms-item>
					<uni-forms-item label="公司名称" name="name">
						<uni-easyinput 
							v-model="dialog.queryForm.name" 
							type="text" 
							suffixIcon="search" 
							placeholder="请输入关键字"
							@iconClick="getData()" 
							@confirm="getData()"
						/>
					</uni-forms-item>
				</uni-forms>
				<uni-table style="height: 250px;" ref="table" border stripe>
					<uni-tr>
						<uni-th width="50" align="center"></uni-th>
						<uni-th>公司名称</uni-th>
					</uni-tr>
					<uni-tr v-for="(item, index) in dialog.tableData" :key="index">
						<uni-td width="50">
							<checkbox
								:value="item.companyId+''"
								:checked="item.companyId == dialog.check.companyId"
								style="transform:scale(0.7)" 
								@click="handleClick($event, item.companyId)" 
							/>
						</uni-td>
						<uni-td>{{ item.companyName }}</uni-td>
					</uni-tr>
				</uni-table>
				<view style="margin-top: 10px;">
					<uni-pagination 
						show-icon 
						:page-size="dialog.queryForm.pageSize" 
						:current="dialog.queryForm.pageNum" 
						:total="dialog.queryForm.total" 
						@change="pageChange" 
					/>
				</view>
				<button type="primary" class="btn" @click="buildTicket" style="margin: 8px;">生成委托单</button>
			</view>
		</uni-popup>
	</view>
</template>

<script>
import { sampleList, sampleAuth, sampleCreate, checkCompanys } from '@/api/sampleCheck/index'
import { decrypt } from '@/common/jsencrpty.js'
	
export default {
	data() {
		return {
			userInfo: {},
			projectInfo: {},
			listData: [],
			searchForm: {
				qrCode:'',//唯一标识
				// code: '',
				// projectName: '',
				// checkItem: '',
				// checker: '',
				// jzr: '',
				// sampleTime: [],
				// checkProgress: null,
				pageNum: 1,
				pageSize: 10,
				total: 0
			},
      reload: false,
      status: 'more',
      contentText: {
      	contentdown: '上拉加载更多',
      	contentrefresh: '加载中',
      	contentnomore: '没有更多数据了'
      },
			// 生成委托单
			dialog: {
				queryForm: {
					name: '',
					pageNum: 1,
					pageSize: 5,
					total: 0
				},
				check: {
					companyId: '',
					date: ''
				},
				tableData: []
			},
			// 检测进度
			checkProgressOptions: [{ value: '', name: '全部' }, { value: 1, name: '已委托' }, { value: 2, name: '待委托' }],
			checkProgressIndex: 0,
			// 授权的单位
			authorizeUnit: [],
			authorizeUnitOptions: [{ value: 1, text: '施工单位' }, { value: 2, text: '监理单位' }],
			sampleId: ''
		};
	},
	computed:{
		startDate() {
			var date= new Date(); return date.toString()
			},
	},
	onLoad() {
		this.userInfo = uni.getStorageSync('userInfo')
		this.userInfo.nickName = decrypt(this.userInfo.nickName)
		this.projectInfo = uni.getStorageSync('projectInfo')
		this.getList()
	},
	onReachBottom() {
		if (this.status != 'noMore') {
			this.reload = true
			this.status = 'more'
			this.searchForm.pageNum++
			this.getList()
		}
	},
	methods: {
		//搜索
		search(){
			sampleList(this.searchForm).then(res=>{
				this.listData = res.rows
				this.searchForm.total = res.total
			})
			this.popupToggle('close')
		},
		// 复选框单选
		handleClick($event, id) {
			this.dialog.check.companyId = id
		},
		// 分页触发
		pageChange(e) {
			this.dialog.queryForm.pageNum = e.current
			this.getData()
		},
		// 查询当前项目下检测机构
		getData() {
			this.dialog.queryForm.projectId = uni.getStorageSync('projectInfo').id
			checkCompanys(this.dialog.queryForm).then(res=>{
				this.dialog.tableData = res.rows
				this.dialog.queryForm.total = res.total
			})
		},
		// 获取列表数据
		getList() {
			this.status = 'loading'
			sampleList(this.searchForm).then(res=>{
				this.reload = false
				this.listData = this.listData.concat(res.rows)
				this.searchForm.total = res.total
				if (this.searchForm.pageNum*this.searchForm.pageSize >= res.total) {
					this.status = 'noMore'
				} else {
					this.status = 'more'
				}
			})
		},
		// 弹出层开关
		popupToggle(flag) {
			if (flag == 'open') {
				this.$refs.sampleSearchPopup.open('right');
			} else {
				this.$refs.sampleSearchPopup.close();
			}
		},
		// 查询检测进度改变
		checkProgressChange() {
			
		},
		// 信息查看
		toPath(url) {
			if (url.indexOf('pdf') != -1) {
				uni.navigateTo({
					url: '/pages/qualityReport/CheckReport?path='+url
				});
			} else {
				uni.navigateTo({
					url: url
				});
			}
		},
		// 委托单授权
		authorize(item) {
			this.authorizeUnit = []
			if (item.order) {
				if (item.order.sgdwPrint) {
					this.authorizeUnit.push(1)
				}
				if (item.order.jldwPrint) {
					this.authorizeUnit.push(2)
				}
			}
			this.sampleId = item.sampling.id
			this.$refs.sampleAuthorizePopup.open('center');
		},
		// 确认授权
		dialogConfirm() {
			let id = this.sampleId, type = 0
			if (this.authorizeUnit.length == 0) {
				type = 0
			} else if (this.authorizeUnit.length == 2) {
				type = 3
			} else {
				if (this.authorizeUnit[0] == 1) {
					type = 1
				} else {
					type = 2
				}
			}
			sampleAuth(id, type).then(res=>{
				if (res.code == 200) {
					if (res.data == -1) {
						uni.showToast({
							title: '暂无委托单',
							icon: 'none'
						})
					} else {
						uni.showToast({
							title: '授权成功'
						})
						this.listData = []
						this.getList()
					}
				}
			})
		},
		// 打开委托单生成弹窗
		openDialog(item) {
			this.sampleId = item.sampling.id
			this.searchForm.pageNum = 1
			this.getData()
			this.$refs.companyPopup.open('center')
		},
		// 委托单生成
		buildTicket() {
			if (this.dialog.check.date == '') {
				uni.showToast({
					title: '请选择日期',
					icon: 'none'
				})
				return false
			}
			if (this.dialog.check.companyId == '') {
				uni.showToast({
					title: '请选择检测机构',
					icon: 'none'
				})
				return false
			}
			uni.showLoading({
				mask: true,
				title: '委托单正在提交监管端生成...'
			})
			sampleCreate(this.dialog.check, this.sampleId).then(res=>{
				uni.hideLoading()
				if (res.code == 200) {
					uni.showToast({
						title: '委托单生成成功'
					})
					this.$refs.companyPopup.close()
					this.listData = []
					this.getList()
				}
			}).catch(error=>{
				uni.hideLoading()
			})
		}
	}
};
</script>
<style lang="scss" scoped>
#sampleSearch {
	min-height: 100vh;
	background-color: #fafafa;

	.nav-box {
		width: 100vw;
		height: 160px;
		margin-top: -44px;
		padding: 56px 20px 56px 20px;
		background-image: url(../../static/img/home/head-bg.png);

		.nav-box-text {
			height: 50px;
			display: flex;
			align-items: center;

			.person {
				width: 48px;
				height: 48px;
			}
			.welcome {
				color: #333;
				font-size: 32rpx;
				margin-left: 40rpx;
			}
		}
	}

	.project {
		display: flex;
		align-items: center;
		justify-content: space-between;
		padding: 10px;
		border-radius: 8px;
		background-color: #fff;
		margin: -32px 20px 0 20px;
		box-shadow: 0px 0px 5px 1px rgba(0, 0, 0, 0.1);

		text {
			font-size: 14px;
			font-weight: 700;
		}
		/deep/ uni-button {
			margin: 0;
			flex: 0 0 auto;
			padding: 2px 4px;
			line-height: normal;
		}
	}

	.uni-list-box {
		margin-top: -20px;
		padding: 20px 20px 10px 20px;

		.list-item {
			padding: 10px;
			margin-top: 10px;
			min-height: 50px;
			background: #fff;
			border-radius: 8px;
			box-shadow: 0px 0px 5px 1px rgba(0, 0, 0, 0.1);

			.list-item-line {
				height: 36px;
				display: flex;
				position: relative;
				align-items: center;
				border-bottom: 1rpx solid #bfbfbf;

				.item-text {
					overflow: hidden;
					font-weight: 700;
					white-space: nowrap;
					text-overflow: ellipsis;
				}
				.sub-text {
					color: #999;
					overflow: hidden;
					white-space: nowrap;
					text-overflow: ellipsis;
				}
				.short {
					letter-spacing: 32px;
				}
			}
			.title {
				justify-content: space-between;
			}
		}
	}

	.popup-search {
		width: 80vw;
		padding-bottom: 10px;
		.search-box {
			padding: 10px 15px;
			.uni-input {
				color: #888;
				line-height: 36px;
			}
		}
	}

	.build-container {
		/deep/ .uni-popup__wrapper {
			width: 60vw;
			border-radius: 10px;
		}
		.dialog-content {
			text-align: center;
			.build-loding {
				width: 60px;
				height: 60px;
				color: #999;
				font-size: 60px;
				text-indent: -9999em;
				overflow: hidden;
				width: 1em;
				height: 1em;
				border-radius: 50%;
				margin: 42px auto;
				position: relative;
			}

			.build-success {
				height: 140px;
				display: flex;
				align-items: center;
				justify-content: center;
			}

			.build-loding-text {
				font-size: 16px;
				line-height: 16px;
				margin-bottom: 10px;
				color: #999;
			}
		}
	}
	
	.popup-content {
		width: 80vw;
		height: 452px;
		
		/deep/ .uni-table {
			min-width: auto !important;
		}
		/deep/ .uni-date__x-input {
			height: 32px;
			line-height: 32px;
		}
		/deep/ .uni-date-editor--x .uni-date__icon-clear {
			top: 0
		}
	}
}
</style>
